<template>
    <div class="header1">
      <span></span>
      <span>猫眼电影</span>
      <span>图标</span>
    </div>
  </template>
  
  <script>
  export default {
    name: "header1",
  };
  </script>
  
  <style scoped>
  /* scoped 只在该组件起作用 */
  .header1 {
    width: 100%;
    height: 50.5px;
    line-height: 50.5px;
    display: flex;
    background: #e54847;
    color: #fff;
  }
  .header1 span:nth-of-type(1),
  .header1 span:nth-of-type(3) {
    width: 15%;
  }
  .header1 span:nth-of-type(2) {
    width: 70%;
    text-align: center;
  }
  </style>